import React, {Component} from 'react';
import {Image, StyleSheet, Text, View, ImageBackground} from 'react-native';
import {Flex, WingBlank} from '@ant-design/react-native';
import {Card} from 'react-native-shadow-cards';
class CwCard extends Component {
    constructor(props) {
        super(props);
    }
    render() {
        return (
            <Card style={{width: '92%', marginLeft: '4%', marginRight: '4%', paddingTop: 10, paddingBottom: 10, marginTop: 10}}>
                <Flex style={styles.flex}>
                    <Flex style={{width: '20%'}}>
                        <ImageBackground
                            style={{width: '100%', height: undefined, aspectRatio: 1 / 1}}
                            source={require('~/assets/community/background.png')}>
                            <Flex style={{height: '100%', width: '100%'}} direction="column" justify="center">
                                <Text style={{color: 'white', fontSize: 16, width: '100%', textAlign: 'center'}}>{this.props.item.ParkingName}</Text>
                            </Flex>
                        </ImageBackground>
                    </Flex>
                    <Flex style={styles.itemtextview}>
                        <Flex style={styles.item}>
                            <Text numberOfLines={1} style={styles.lowername}>
                                {this.props.item.AreaName}/{this.props.item.ParkingName}
                            </Text>
                        </Flex>
                        <Flex style={{width: '100%', paddingLeft: 10, paddingRight: 10, height: 15}}>
                            <Text style={styles.text}>
                                建筑面积:
                                <Text style={styles.ttext}>{this.props.item.AreaBuilt}㎡ </Text>
                            </Text>
                            <Text style={styles.text}>
                                使用面积: <Text style={styles.ttext}>{this.props.item.AreaInner}㎡</Text>
                            </Text>
                        </Flex>
                        <Flex style={styles.item} direction={'row'} justify={'between'}>
                            <Text style={styles.money}>
                                {this.props.item.PricePromotion > 0 ? '活动价' : '促销价'}
                                <Text
                                    style={{
                                        fontSize: 18,
                                    }}>
                                    {this.props.item.PricePromotion > 0 ? this.props.item.PricePromotion : this.props.item.PriceSell}
                                </Text>
                                元
                            </Text>
                            <Text style={{color: '#999999', fontSize: 11, marginTop: 6, marginLeft: -10}}>
                                原价
                                <Text>{this.props.item.PriceMarket}</Text>元
                            </Text>
                            <Flex>
                                {this.props.item.SellState == 1 && (
                                    <Image style={{width: 42, height: 18}} source={require('~/assets/community/keshou.png')} />
                                )}
                                {this.props.item.SellState == 3 && (
                                    <Image style={{width: 42, height: 18}} source={require('~/assets/community/yiding.png')} />
                                )}
                                {this.props.item.SellState == 5 && (
                                    <Image style={{width: 42, height: 18}} source={require('~/assets/community/yiding.png')} />
                                )}
                                {this.props.item.SellState == 7 && (
                                    <Image style={{width: 42, height: 18}} source={require('~/assets/community/yishou.png')} />
                                )}
                            </Flex>
                        </Flex>
                    </Flex>
                </Flex>
            </Card>
        );
    }
}

export default CwCard;

const styles = StyleSheet.create({
    flex: {
        backgroundColor: 'white',
        width: '100%',
        borderRadius: 5,
        paddingLeft: 10,
        paddingRight: 10,
    },
    image: {
        width: '100%',
        resizeMode: 'contain',
    },
    itemtextview: {
        flexDirection: 'column',
        width: '80%',
        paddingLeft: 5,
    },
    item: {
        width: '100%',
        paddingLeft: 10,
        paddingRight: 10,
        height: 25,
    },
    lowername: {
        fontSize: 13,
        color: '#444444',
        fontWeight: 'bold',
    },
    text: {
        fontSize: 9,
        color: '#666666',
    },
    ttext: {
        color: 'black',
    },
    money: {
        fontSize: 11,
        color: '#CE2D32',
    },
});
